<template>
  <div @click="openSearchTop">
    <div class="search-block" v-if="showsearch">
      <searchtab @searchopen="opensearch" @checkstab="goindex" @linksearch="searchlink" :tablist="tablistprop"></searchtab>
    </div>
    <div class="search-block-new" v-if="showsearchlist">
      <searchlist @cansearch="searchcan" :searchprop="searchtext"></searchlist>
    </div>
    <div class="login-bloock" v-if="showlogin">
      <loginpop @bindlogin="loginbloock" @nickname="shownickname" :registershow="registertp"></loginpop>
    </div>
    <div class="detail-top-tab">
     <!--  <div class="center-logo pc-bk">
        <img src="../../img/mobile/logonew.png" alt="">
      </div> -->
      <div class="header-block">
        <div class="header-body">
          <div class="header-logo pc-bk" @click="GoToindex">
            <!--<img src="../../img/mobile/logo.jpg" alt="">-->
          </div>
          <!-- <div class="header-home pc-bk" @click="GoToindex" :class="{active: checkhome === 'TOP'}">
            首页
            <span class="line-bot"></span>
          </div> -->
          <div class="header-logo mobile-top" @click="GoToindex">
            <img src="../../img/mobile/logo1.png" alt="">
          </div>
          <div class="header-tab mobile-top" id="swiper-tab">
            <swiper :options="swiperOption" ref="mySwiper">
              <swiper-slide v-for="(tablist,index) in tablist" v-if="tablist.id !== 'TOP'" :class="{active: checktab===tablist.id - 1}"><div class="swiper-block"><span class="line-bot"></span><span :data-id="tablist.id" @click="selectab">{{tablist.name}}</span></div></swiper-slide>
            </swiper>
          </div>
          <div class="header-tab" id="li-tab">
            <ul>
              <li :class="{active: checkhome === 'TOP'}" class="tabslist">
                <div class="swiper-block"  @click="GoToindex"><span class="line-bot"></span><span>首页</span></div>
              </li>
              <li v-for="(tablist,index) in tablist" v-if="tablist.id !== 'TOP'" :class="{active: checktab===tablist.id - 1}" class="tabslist">
                <div class="hover-tab pc-top">
                  <div class="second-tab-bk">
                    <div class="second-tab-child">
                      <div class="tab-ele tab-ele-navname">
                        <!--<div class="navname-title">{{tablist.name}}</div>-->
                          <span class="second-title" v-for="(hovertab, index) in tablist.list"  @mouseover="tabHover(hovertab)"  @click="moreBtn" :data-itemid="hovertab.news[0].id" :data-id="hovertab.id" :data-fid="tablist.id" :data-type="hovertab.content_type">{{hovertab.name}}</span>
                        <div class="clear"></div>
                      </div>
                      <div class="tab-ele tab-ele-article" v-bind:class="{'hidden':ishover}">
                        <!--<div class="navname-title">{{tablist.name}}推荐</div>-->
                        <div v-if="tablist.news.length > 0">
                          <div class="tab-ele-atr" v-for="hoverart in tablist.news" @click="linkDetail" :data-id="hoverart.id" :data-fid="tablist.id">
                            <div class="tab-img-block">
                              <div class="tab-ele-img" :style="{backgroundImage:'url(' + hoverart.cover_path + ')'}"></div>
                            </div>
                            <div class="tab-ele-note">{{hoverart.title}}</div>
                          </div>
                        </div>
                        <div class="empty-second" v-else>
                          暂无内容
                        </div>
                        <div class="tab-ele-hover"></div>
                      </div>
                      <div class="tab-ele tab-ele-recommend"  v-bind:class="{'hidden':!ishover}">
                        <!--<div class="navname-title">{{hovertitle}}</div>-->
                        <div v-if="navrecommend.length>0">
                          <ul>
                            <li v-for="navrcmd in navrecommend" @click="linkDetail" :data-id="navrcmd.id" :data-fid="tablist.id" :data-len="navrcmd.author_info.length">
                              <div class="left-recommend-img" v-lazy:background-image="{src: navrcmd.cover_path, error: imgUrl, loading: imgUrl}">
                              </div>
                              <div class="right-recommend-info">
                                <div class="recommend-info-title">{{navrcmd.title}}</div>
                                <div class="right-content-note nav-content-note">
                                  {{navrcmd.note}}
                                </div>
                              </div>
                              <div class="clear"></div>
                            </li>
                          </ul>
                        </div>
                        <div class="empty-second" v-else>
                          暂无内容
                        </div>
                      </div>
                      <div class="clear"></div>
                    </div>
                  </div>
                </div>
                <!--<div class="swiper-block" v-if="tablist.id === 5" :data-id="tablist.id" :data-listid="tablist.list[0].news[0].id" @click="toIffDetail" @mouseover="outHover"><span class="line-bot"></span><span>{{tablist.name}}</span></div>
                <div class="swiper-block" v-else-if="tablist.id === 4" :data-id="tablist.id" :data-listid="tablist.list[0].news[0].id" @click="toIffDetail" @mouseover="outHover"><span class="line-bot"></span><span>{{tablist.name}}</span></div>-->
                <div class="swiper-block" :data-id="tablist.id" @click="selectab" @mouseover="outHover"><span class="line-bot"></span><span>{{tablist.name}}</span></div>
              </li>
              <div class="nav-login-search pc-bk">
                <div class="login-btn"  @click="toEng">Eng</div>
                <div v-if="!logining">
                <div class="login-btn"  @click="loginBtn">登录</div>
                <div class="login-btn"  @click="registerBtn">注册</div>
                </div>
                <div class="login-btn" @mouseover="showInfo" @mouseout="hideInfo" v-else>
                  <span class="username">{{nickname}}</span>
                  <div class="login-main" v-if="showuserinfo">
                    <ul>
                      <li class="login-info-list" v-for="userpage in userpages" :data-id="userpage.id" @click="toUserpage">
                        {{userpage.name}}
                      </li>
                      <li class="login-info-list" @click="signOut">
                        退出
                      </li>
                    </ul>
                  </div>
                </div>
                <div class="header-search" id="searchmain">
                  <img src="../../img/mobile/search.png" alt="">
                </div>
              </div>
            </ul>
          </div>
          <div class="header-search mobile-top" @click="searchBtn">
            <img src="../../img/mobile/nav.png" alt="">
          </div>
        </div>
      </div>
    </div>
    <div class="search-link-home" v-if="searchshow" id="searchmain1"><!--搜索全站-->
      <div class="search-main">
        <input type="text"  v-model="searchtext" placeholder="全站搜索 Search" @keyup.enter="searchBtn1">
        <img src="../../img/mobile/search_new.png"  @click="searchBtn1">
        </div>
    </div>
    <div class="pc-bk" v-if="thistab === 'TOP'"><!--精选首页部分-->
      <div class="container-list">
        <div class="content-list-body pc-bk">
          <div><!--头部banner-->
            <div class="content-first top-banner">
              <div class="link-detail">
                <div class="top-big-img" v-if="banner_list.length > 0">
                  <swiper :options="swiperOptionHome" ref="mySwiper">
                    <swiper-slide v-for="(contlist,index) in banner_list" v-lazy:background-image="{src: contlist.img, error: imgUrl, loading: imgUrl}"><div class="swiper-block" @click="bannerLink" :data-link="contlist.link"  style="width: 100%; height: 100%;"><span class="line-bot"></span></div></swiper-slide>
                    <div class="swiper-pagination" v-bind:class="{'hidden': paginationhd}" slot="pagination"></div>
                  </swiper>
                </div>
              </div>
            </div>
          </div>
          <div class="middle-block"><!--中间三模块-->
            <div class="middle-left-block side-block middle-main" v-if="special_attention.length > 0">
              <div class="side-header">
                <span class="sidle-text">特别关注</span>
                <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
              </div>
              <div class="focus-img" @click="linkDetail" :data-id="special_attention[0].id" :style="{backgroundImage:'url(' + special_attention[0].cover_path + ')'}">
                <div class="focus-title">{{special_attention[0].title}}</div>
              </div>
              <div class="focus-list">
                <ul>
                  <li v-for="(special, index) in special_attention" @click="linkDetail" :data-id="special.id" v-if="index>0 && index <6">
                    <span class="focus-icon">
                    </span>
                    <span class="focus-title-link">
                      {{special.title}}
                    </span>
                  </li>
                </ul>
              </div>
            </div>
            <div class="middle-mid-block middle-main"><!--视频分类-->
              <div class="video-header-tab">
                <!-- <div class="header-tab-first header-tab-list" @click="checkVideo" :data-index="index" v-for="(videolist, index) in video_list" v-bind:class="{'active' : index === vediotab}">
                  <span>{{videolist.cate_name}}</span>
                </div> -->
                <div class="side-header hy-light-md homered" @click="moreBtn" :data-id="videolist.list[0].second_level_cid" data-type="NEWS" v-for="(videolist, index) in video_list" v-if="index===0">
                  <span class="sidle-text">{{videolist.cate_name}}</span>
                  <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
                  <span class="sidle-right-icon">
                    <img src="../../img/mobile/righticon.png">
                  </span>
                </div>
              </div>
              <div class="video-content">
                <video-player  class="video-player vjs-custom-skin"
                               ref="videoPlayer"
                               :playsinline="true"
                               :options="playerOptionsHome"
                               @ready="playerReadied($event)">
                </video-player>
              </div>
            </div>
            <div class="middle-right-block middle-main">
              <div class="side-header" @click="moreBtn" :data-id="special_column.author_list[0].second_level_cid" data-type="AUTHOR">
                <span class="sidle-text">{{special_column.author_list[0].second_level_cname}}</span>
                <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
                <span class="sidle-right-icon">
                  <img src="../../img/mobile/righticon.png">
                </span>
              </div>
              <div class="column-article" v-if="special_column.news_list.length > 0 && special_column.news_list[0].author_info.length > 0" @click="authorDetail" :data-id="special_column.news_list[0].author_info[0].id">
                <div class="left-column-author">
                  <div class="left-column-header" :style="{backgroundImage:'url(' + special_column.news_list[0].author_info[0].cover_path + ')'}"></div>
                </div>
                <div class="right-column-at">
                  <div class="column-at-title">
                    {{special_column.news_list[0].title}}
                  </div>
                  <div class="column-at-info">
                    {{special_column.news_list[0].note}}
                  </div>
                  <div class="column-author">
                    {{special_column.news_list[0].author}}
                  </div>
                  <div class="column-author" v-if="special_column.news_list[0].author_info.length > 0">
                    {{special_column.news_list[0].author_info[0].job}}
                  </div>
                </div>
                <div class="clear"></div>
              </div>
              <div class="column-member">
                <div class="column-member-list" @click="authorDetail" :data-id="authorlist.id" v-for="(authorlist, index) in special_column.author_list" v-if="index < 3">
                  <div class="column-member-header" :style="{backgroundImage:'url(' + authorlist.cover_path + ')'}"></div>
                  <div class="column-member-name">
                    {{authorlist.title}}
                  </div>
                </div>
              </div>
            </div>
            <div class="clear"></div>
          </div>
          <div class="iff-meeting big-block"  v-if="activity_banner_list.length > 0">
            <div class="big-title-header">
              <span class="sidle-text">IFF年会 </span>
              <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
            </div>
            <div class="meeting-banner" @click="toDetail" :data-link="activity_banner_list[0].link" :style="{backgroundImage:'url(' + activity_banner_list[0].img + ')'}"></div>
          </div>
          <div class="iff-agenda big-block" v-if="special_subject_list.length > 0">
            <div class="big-title-header">
              <span class="sidle-text">IFF专题</span>
              <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
            </div>
            <div class="iff-agenda-list iff-mg-bk">
              <div class="agenda-list" @click="linkTopicDetail" :data-id="speciallist.id" v-for="(speciallist, index) in special_subject_list" v-if="index< 5">
                <div class="agendalist">
                  <div class="agenda-img" :style="{backgroundImage:'url(' + speciallist.thumbnail + ')'}"></div>
                  <!-- <div class="agenda-author">
                    潘基文：
                  </div> -->
                  <div class="agenda-title">
                    {{speciallist.name}}
                  </div>
                  <div class="agenda-article-info"
                       style="/* autoprefixer: off*/
                              -webkit-box-orient: vertical;
                              /* autoprefixer: on*/">
                    {{speciallist.note}}
                  </div>
                  <div class="article-share-icon">
                    <img src="../../img/mobile/at-share-icon.png">
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="clear"></div>
      </div>
    </div>
    <div class="pc-bk" v-if="thistab === 'hy'"><!--会议部分-->
      <div class="container-list" v-if="dataList.length>0">
        <div class="content-list-body pc-bk">
          <div><!--头部banner-->
            <div class="content-first top-banner">
              <div class="link-detail">
                <div class="top-big-img" v-if="banner_list.length > 0">
                  <swiper :options="swiperOptionHome" ref="mySwiper">
                    <swiper-slide v-for="(contlist,index) in banner_list" :style="{backgroundImage:'url(' + contlist.img + ')'}"><div class="swiper-block" @click="bannerLink" :data-link="contlist.link"  style="width: 100%; height: 100%;"><span class="line-bot"></span></div></swiper-slide>
                    <div class="swiper-pagination" v-bind:class="{'hidden': paginationhd}" slot="pagination"></div>
                  </swiper>
                </div>
              </div>
            </div>
          </div>
          <div class="middle-block"><!--中间三模块-->
            <div class="middle-left-block side-block middle-main"><!--左侧-->
              <div class="side-header hy homered">
                <span class="sidle-text">会议
                <!-- <i>BRAINPOWER</i> -->
                </span>
                <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
              </div>
              <div class="meeting-list">
                <ul>
                  <li v-for="datanew in sideNav" @click="moreBtn" :data-id="datanew.id" :data-type="datanew.content_type">
                    <span class="focus-icon">
                    </span>
                    <span class="focus-title-link">
                      {{datanew.name}}
                    </span>
                  </li>
                </ul>
              </div>
              <div class="focus-img hy" v-for="ads in ads"  @click="bannerLink" :data-link="ads.link" :style="{backgroundImage:'url(' + ads.img + ')'}"></div>
            </div>
            <div class="middle-mid-block middle-main" v-for="recommendlist in dataList" v-if="recommendlist.type === 'top' && recommendlist.link_type === 'ads'"><!--中间-->
              <!-- <div class="middle-article-list" @click="linkDetail" :data-id="midlist.id" v-for="(midlist, midindex) in recommendlist.list" v-if="midindex < 3">
                <div class="middle-article-img" :style="{backgroundImage:'url(' + prefix + midlist.cover_path + ')'}">
                </div>
                <div class="mid-article-info">
                  <div class="mid-article-title">{{midlist.title}}</div>
                  <div class="mid-article-intro">
                  {{midlist.note}}
                  </div> -->
                  <!-- <div class="mid-article-more"><i>MORE</i></div> -->
                <!-- </div>
                <div class="clear"></div> -->
              <div class="middle-top-banner" @click="bannerLink" :data-link="midlist.link" v-for="(midlist, midindex) in recommendlist.list" v-if="midindex === 0" :style="{backgroundImage:'url(' + midlist.img + ')'}"></div>
              <!-- </div> -->
            </div>
            <div class="middle-right-block middle-main" v-for="(rightrcmd, rcmdindex) in dataList" v-if="rightrcmd.type === 'recommend'"><!--右侧-->
              <div class="side-header hy-light-at homered"  @click="moreBtn" :data-id="rightrcmd.second_level_cid" data-type="">
                <span class="sidle-text">{{rightrcmd.second_level_name}} </span>
                <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
                <span class="sidle-right-icon">
                  <img src="../../img/mobile/righticon.png">
                </span>
              </div>
              <div class="mid-right-focus" @click="linkDetail" :data-id="recomdlist.id" v-for="(recomdlist, listindex) in rightrcmd.list" v-if="listindex === 0">
                <div class="focus-img hy" :style="{backgroundImage:'url(' + prefix + recomdlist.cover_path + ')'}">
                </div>
                <div class="annual-meeting">
                  <!-- <div class="annual-author">
                    {{recomdlist.author}}：
                  </div> -->
                  <div class="annual-meeting-title">
                    {{recomdlist.title}}
                  </div>
                  <div class="annual-meeting-intro">
                    {{recomdlist.note}}
                  </div>
                  <div class="article-share-icon">
                    <img src="../../img/mobile/at-share-icon.png">
                  </div>
                </div>
              </div>
            </div>
            <div class="clear"></div>
          </div>
          <div class="iff-agenda big-block">
            <div class="iff-agenda-list">
              <div class="agenda-list" v-if="datalist.type === 'normal' && datalist.list.length > 0" v-for="(datalist,index) in dataList" >
                <div class="side-header hy-light-at homered" @click="moreBtn" :data-id="datalist.second_level_cid" data-type="">
                  <span class="sidle-text">{{datalist.second_level_name}} </span>
                  <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
                  <span class="sidle-right-icon">
                    <img src="../../img/mobile/righticon.png">
                  </span>
                </div>
                <div class="agendalist" @click="linkDetail" :data-id="datacont.id" v-for="(datacont,dataindex) in datalist.list" v-if="dataindex === 0" >
                  <div class="agenda-img" :style="{backgroundImage:'url(' + prefix + datacont.cover_path + ')'}"></div>
                  <!-- <div class="agenda-author hy">
                    {{datacont.author}}：
                  </div> -->
                  <div class="agenda-title hy">
                    {{datacont.title}}
                  </div>
                  <div class="agenda-article-info"
                       style="/* autoprefixer: off*/
                              -webkit-box-orient: vertical;
                              /* autoprefixer: on*/">
                    {{datacont.note}}
                  </div>
                  <div class="article-share-icon">
                    <img src="../../img/mobile/at-share-icon.png">
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="clear"></div>
      </div>
      <div class="no-content" v-else>
        <div class="nosearch">
          <img src="../../img/mobile/emptycontent.jpeg" alt="">
        </div>
        <!-- 空空如也！ -->
      </div>
    </div>
    <div class="pc-bk" v-if="thistab === 'sx'"><!--
                  <span class="sidle-right-icon">
                    <img src="../../img/mobile/righticon.png">
                </span>部分-->
      <div class="container-list" v-if="dataList.length>0">
        <div class="content-list-body pc-bk">
          <div><!--头部banner-->
            <div class="content-first top-banner">
              <div class="link-detail">
                <div class="top-big-img" v-if="banner_list.length > 0">
                  <swiper :options="swiperOptionHome" ref="mySwiper">
                    <swiper-slide v-for="(contlist,index) in banner_list" :style="{backgroundImage:'url(' + contlist.img + ')'}"><div class="swiper-block" @click="bannerLink" :data-link="contlist.link"  style="width: 100%; height: 100%;"><span class="line-bot"></span></div></swiper-slide>
                    <div class="swiper-pagination" v-bind:class="{'hidden': paginationhd}" slot="pagination"></div>
                  </swiper>
                </div>
              </div>
            </div>
          </div>
          <div class="middle-block"><!--中间三模块-->
            <div class="middle-left-block side-block middle-main"><!--左侧-->
              <div class="side-header hy homered">
                <span class="sidle-text">思想
                <!-- <i>BRAINPOWER</i> -->
                </span>
                <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
              </div>
              <div class="meeting-list">
                <ul>
                  <li v-for="datanew in sideNav" @click="moreBtn" :data-id="datanew.id" :data-type="datanew.content_type">
                    <span class="focus-icon">
                    </span>
                    <span class="focus-title-link">
                      {{datanew.name}}
                    </span>
                  </li>
                </ul>
              </div>
              <div v-if="ads.length>0">
                <div class="focus-img hy" v-for="ads in ads"  @click="bannerLink" :data-link="ads.link" :style="{backgroundImage:'url(' + ads.img + ')'}">
                </div>
              </div>
            </div>
            <div class="middle-mid-block middle-main" v-for="recommendlist in dataList" v-if="recommendlist.type === 'top' && recommendlist.link_type === 'ads'"><!--中间-->
              <!-- <div class="middle-article-list" @click="bannerLink" :data-link="ads.link" v-for="(midlist, midindex) in recommendlist.list"  v-if="midindex === 0" >
                <div class="middle-article-img" :style="{backgroundImage:'url(' + midlist.img + ')'}">
                </div>
                <div class="mid-article-info">
                  <div class="mid-article-title">{{midlist.title}}</div>
                  <div class="mid-article-intro">
                    {{midlist.note}}
                  </div> -->
                  <!-- <div class="mid-article-more"><i>MORE</i></div> -->
                <!-- </div>
                <div class="clear"></div>
              </div> -->
              <div class="middle-top-banner" @click="bannerLink" :data-link="midlist.link" v-for="(midlist, midindex) in recommendlist.list" v-if="midindex === 0" :style="{backgroundImage:'url(' + midlist.img + ')'}"></div>
            </div>
            <div class="middle-right-block middle-main" v-for="(rightrcmd, rcmdindex) in dataList" v-if="rightrcmd.type === 'recommend'"><!--右侧-->
              <div class="side-header hy-light-at homered" @click="moreBtn" :data-id="rightrcmd.second_level_cid" data-type="">
                <span class="sidle-text">{{rightrcmd.second_level_name}}</span>
                <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
                <span class="sidle-right-icon">
                  <img src="../../img/mobile/righticon.png">
                </span>
              </div>
              <div class="mid-right-focus" @click="linkDetail" :data-id="recomdlist.id" v-for="(recomdlist, listindex) in rightrcmd.list" v-if="listindex === 0">
                <div class="focus-img hy" :style="{backgroundImage:'url(' + prefix + recomdlist.cover_path + ')'}">
                </div>
                <div class="annual-meeting">
                  <!-- <div class="annual-author">
                    {{recomdlist.author}}：
                  </div> -->
                  <div class="annual-meeting-title">
                    {{recomdlist.title}}
                  </div>
                  <div class="annual-meeting-intro">
                    {{recomdlist.note}}
                  </div>
                  <!-- <div class="article-share-icon">
                    <img src="../../img/mobile/at-share-icon.png">
                  </div> -->
                </div>
              </div>
            </div>
            <div class="clear"></div>
          </div>
          <div class="iff-agenda big-block">
            <div class="iff-agenda-list">
              <div class="agenda-list"  v-if="datalist.type === 'normal' && datalist.list.length > 0" v-for="(datalist,index) in dataList" >
                <div class="side-header hy-light-at homered" @click="moreBtn" :data-id="datalist.second_level_cid" data-type="">
                  <span class="sidle-text">{{datalist.second_level_name}}</span>
                  <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
                  <span class="sidle-right-icon">
                    <img src="../../img/mobile/righticon.png">
                  </span>
                </div>
                <div class="agendalist" @click="linkDetail" :data-id="datacont.id" v-for="(datacont,dataindex) in datalist.list" v-if="dataindex === 0" >
                  <div class="agenda-img" :style="{backgroundImage:'url(' + prefix + datacont.cover_path + ')'}"></div>
                  <!-- <div class="agenda-author hy">
                    {{datacont.author}}：
                  </div> -->
                  <div class="agenda-title hy">
                    {{datacont.title}}
                  </div>
                  <div class="agenda-article-info"
                       style="/* autoprefixer: off*/
                              -webkit-box-orient: vertical;
                              /* autoprefixer: on*/">
                    {{datacont.note}}
                  </div>
                  <div class="article-share-icon">
                    <img src="../../img/mobile/at-share-icon.png">
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="clear"></div>
      </div>
      <div class="no-content" v-else>
        <div class="nosearch">
          <img src="../../img/mobile/emptycontent.jpeg" alt="">
        </div>
        <!-- 空空如也！ -->
      </div>
    </div>
    <div class="pc-bk" v-if="thistab === 'zk'"><!--智库部分-->
      <div class="container-list" v-if="dataList.length>0">
        <div class="content-list-body pc-bk">
          <div><!--头部banner-->
            <div class="content-first top-banner">
              <div class="link-detail">
                <div class="top-big-img" v-if="banner_list.length > 0">
                  <swiper :options="swiperOptionHome" ref="mySwiper">
                    <swiper-slide v-for="(contlist,index) in banner_list" :style="{backgroundImage:'url(' + contlist.img + ')'}"><div class="swiper-block" @click="bannerLink" :data-link="contlist.link"  style="width: 100%; height: 100%;"><span class="line-bot"></span></div></swiper-slide>
                    <div class="swiper-pagination" v-bind:class="{'hidden': paginationhd}" slot="pagination"></div>
                  </swiper>
                </div>
              </div>
            </div>
          </div>
          <div class="middle-block"><!--中间三模块-->
            <div class="middle-left-block side-block middle-main"><!--左侧-->
              <div class="side-header hy homered">
                <span class="sidle-text">智库
                <!-- <i>BRAINPOWER</i> -->
                </span>
                <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
              </div>
              <div class="meeting-list">
                <ul>
                  <li v-for="datanew in sideNav" @click="moreBtn" :data-id="datanew.id" :data-type="datanew.content_type">
                    <span class="focus-icon">
                    </span>
                    <span class="focus-title-link">
                      {{datanew.name}}
                    </span>
                  </li>
                </ul>
              </div>
              <div v-if="ads.length>0">
                <div class="focus-img hy" v-for="ads in ads"  @click="bannerLink" :data-link="ads.link" :style="{backgroundImage:'url(' + ads.img + ')'}">
                </div>
              </div>
            </div>
            <div class="middle-mid-block middle-main" v-for="recommendlist in dataList" v-if="recommendlist.type === 'top' && recommendlist.link_type === 'ads'"><!--中间-->
              <!-- div class="middle-article-list" @click="linkDetail" :data-id="midlist.id" v-for="(midlist, midindex) in recommendlist.list" v-if="midindex === 0">
                <div class="middle-article-img" :style="{backgroundImage:'url(' + prefix + midlist.cover_path + ')'}">
                </div>
                <div class="mid-article-info">
                  <div class="mid-article-title">{{midlist.title}}</div>
                  <div class="mid-article-intro">
                  {{midlist.note}}
                  </div> -->
                  <!-- <div class="mid-article-more"><i>MORE</i></div> -->
                <!-- </div>
                <div class="clear"></div>
              </div> -->
              <div class="middle-top-banner" @click="bannerLink" :data-link="midlist.link" v-for="(midlist, midindex) in recommendlist.list" v-if="midindex === 0" :style="{backgroundImage:'url(' + midlist.img + ')'}"></div>
            </div>
            <div class="middle-right-block middle-main" v-for="(rightrcmd, rcmdindex) in dataList" v-if="rightrcmd.type === 'recommend'"><!--右侧-->
              <div class="side-header hy-light-at homered" @click="moreBtn" :data-id="rightrcmd
.second_level_cid" data-type="AUTHOR">
                <span class="sidle-text">{{rightrcmd.second_level_name}}</span>
                <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
                <span class="sidle-right-icon">
                  <img src="../../img/mobile/righticon.png">
                </span>
              </div>
              <div class="mid-right-column">
                <div class="zk column-article"  @click="authorDetail" :data-id="recomdlist.id"  v-for="(recomdlist, listindex) in rightrcmd.list">
                  <div class="left-column-author">
                    <div class="left-column-header" :style="{backgroundImage:'url(' + recomdlist.cover_path + ')'}"></div>
                  </div>
                  <div class="right-column-at">
                    <div class="column-at-title">
                      {{recomdlist.title}}
                    </div>
                    <!-- <div class="column-at-info">
                      {{recomdlist.note}}
                    </div> -->
                    <div class="column-author">
                      <!-- {{special_column.news_list[0].author}} -->
                    </div>
                    <div class="column-author">
                      {{recomdlist.job}}
                    </div>
                  </div>
                  <div class="clear"></div>
                </div>
              </div>
            </div>
            <div class="clear"></div>
          </div>
          <div class="iff-agenda big-block">
            <div class="iff-agenda-list">
              <div class="agenda-list" v-if="datalist.type === 'normal' && datalist.list.length > 0" v-for="(datalist,index) in dataList" >
                <div class="side-header hy-light-at homered" @click="moreBtn" :data-id="datalist.second_level_cid" data-type="">
                  <span class="sidle-text">{{datalist.second_level_name}}</span>
                  <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
                  <span class="sidle-right-icon">
                    <img src="../../img/mobile/righticon.png">
                  </span>
                </div>
                <div class="agendalist" @click="linkDetail" :data-id="datacont.id" v-for="(datacont,dataindex) in datalist.list" v-if="dataindex === 0" >
                  <div class="agenda-img" :style="{backgroundImage:'url(' + prefix + datacont.cover_path + ')'}"></div>
                  <!-- <div class="agenda-author hy">
                    {{datacont.author}}：
                  </div> -->
                  <div class="agenda-title hy">
                    {{datacont.title}}
                  </div>
                  <div class="agenda-article-info"
                       style="/* autoprefixer: off*/
                              -webkit-box-orient: vertical;
                              /* autoprefixer: on*/">
                    {{datacont.note}}
                  </div>
                  <div class="article-share-icon">
                    <img src="../../img/mobile/at-share-icon.png">
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="clear"></div>
      </div>
      <div class="no-content" v-else>
        <div class="nosearch">
          <img src="../../img/mobile/emptycontent.jpeg" alt="">
        </div>
        <!-- 空空如也！ -->
      </div>
    </div>
    <div class="pc-bk" :data-id="dataList.length" v-if="thistab === 'iff'"><!--IFF模块-->
      <div class="container-list" v-if="dataList.length>0">
        <div class="content-list-body pc-bk">
          <div><!--头部banner-->
            <div class="content-first top-banner">
              <div class="link-detail">
                <div class="top-big-img" v-if="banner_list.length > 0">
                  <swiper :options="swiperOptionHome" ref="mySwiper">
                    <swiper-slide v-for="(contlist,index) in banner_list" :style="{backgroundImage:'url(' + contlist.img + ')'}"><div class="swiper-block" @click="bannerLink" :data-link="contlist.link"  style="width: 100%; height: 100%;"><span class="line-bot"></span></div></swiper-slide>
                    <div class="swiper-pagination" v-bind:class="{'hidden': paginationhd}" slot="pagination"></div>
                  </swiper>
                </div>
              </div>
            </div>
          </div>
          <div class="middle-block"><!--中间三模块-->
            <div class="middle-left-block side-block middle-main"><!--左侧-->
              <div class="side-header hy homered">
                <span class="sidle-text">国际金融论坛（IFF）
                <!-- <i>BRAINPOWER</i> -->
                </span>
                <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
              </div>
              <div class="meeting-list">
                <ul>
                  <li v-for="datanew in sideNav" @click="moreBtn" v-if="datanew.item_id !== 0" :data-id="datanew.id" :data-type="datanew.content_type">
                    <span class="focus-icon">
                    </span>
                    <span class="focus-title-link">
                      {{datanew.name}}
                    </span>
                  </li>
                </ul>
              </div>
              <div class="focus-img hy" v-for="ads in ads"  @click="bannerLink" :data-link="ads.link" :style="{backgroundImage:'url(' + ads.img + ')'}"></div>
            </div>
            <div class="middle-mid-block middle-main"><!--中间-->
              <div class="side-header hy-light-md homered" @click="moreBtn" :data-id="rcmdcontent.second_level_cid" v-for="(rcmdcontent, index) in dataList" v-if="rcmdcontent.type === 'top'">
                <span class="sidle-text">{{rcmdcontent.second_level_name}}</span>
                <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
              </div>
              <div class="about-sria" v-for="(rcmdcontent, index) in dataList" v-if="rcmdcontent.type === 'top'">
                <swiper :options="swiperOptioniff" ref="mySwiper">
                  <swiper-slide v-for="(contenttop, contindex) in rcmdcontent.list"><div class="mid-block-banner" @click="bannerLink" :data-link="contenttop.link"  :style="{backgroundImage:'url(' + contenttop.img + ')'}" style="width: 100%;"><span class="line-bot"></span></div></swiper-slide>
                  <div class="swiper-pagination" v-bind:class="{'hidden': rcmdcontent.list.length < 2}"  slot="pagination"></div>
                </swiper>
                <!-- <div v-for="(contenttop, contindex) in rcmdcontent.list" v-if="contindex === 0">
                  <div v-if="rcmdcontent.link_type === 'banner'">
                    <div class="mid-block-banner" @click="bannerLink" :data-link="contenttop.link" :style="{backgroundImage:'url(' + contenttop.img + ')'}"></div>
                  </div>
                  <div v-if="rcmdcontent.link_type === 'news'" @click="linkDetail" :data-id="contenttop.id">
                    <div class="abour-sria-img" :style="{backgroundImage:'url(' + prefix + contenttop.cover_path + ')'}"></div>
                    <div class="about-sria-content">
                      <div class="about-sria-note">
                       {{contenttop.note}}
                      </div>
                    </div>
                  </div>
                </div> -->
              </div>
            </div>
            <div class="middle-right-block middle-main" v-if="linksdata.length > 0"><!--右侧-->
              <div class="side-header hy-light-at homered"  :data-id="linkiffid">
                <!-- <span class="sidle-text">{{linktitle}}</span> -->
                <span class="sidle-text">特别关注</span> 
                <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
              </div>
              <div class="operation-list-right"  @click="toDetail"  :data-link="linkicon.link" v-if="linksdata.length > 0" v-for="(linkicon, linkindex) in linksdata">
                <div class="left-opt-icon">
                <img src="../../img/mobile/icon-ifflogo.png">
                  <!-- <img src="../../img/mobile/icon-rule1.png" v-if="linkicon.icon === 'icon-rule'">
                  <img src="../../img/mobile/icon-vip1.png" v-if="linkicon.icon === 'icon-vip'">
                  <img src="../../img/mobile/icon-bill1.png" v-if="linkicon.icon === 'icon-bill'">
                  <img src="../../img/mobile/icon-process1.png" v-if="linkicon.icon === 'icon-process'">
                  <img src="../../img/mobile/icon-table1.png" v-if="linkicon.icon === 'icon-table'">
                  <img src="../../img/mobile/icon-question1.png" v-if="linkicon.icon === 'icon-question'"> -->
                </div>
                <div class="opt-line"></div>
                <div class="right-opt-text">
                  <p class="opt-name">{{linkicon.name}}</p>
                </div>
                <div class="clear"></div>
              </div>
            </div>
            <div class="clear"></div>
          </div>
          <div class="about-iff" v-for="(iffsource, index) in dataList" v-if="iffsource.type === 'source' && iffsource.list[0].banner.length > 0">
            <div class="side-header hy-light homered" @click="moreBtn" :data-id="iffsource.second_level_cid">
              <span class="sidle-text">{{iffsource.second_level_name}}</span>
              <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
            </div>
            <div class="about-iff-main" v-for="(sourcelist, iffindex) in iffsource.list" v-if="iffindex === 0">
              <div class="about-iff-left">
                <div class="iff-left-title">
                  <!-- <span class="focus-icon">
                  </span> -->
                  IFF组织机构
                </div>
                <div class="iff-left-banner" @click="bannerLink" :data-link="sourcelist.banner.link"  :style="{backgroundImage:'url(' + sourcelist.banner.img + ')'}"></div>
              </div>
              <div class="about-iff-right">
                <div class="iff-right-member" @click="linkDetail" :data-id="memrecmd.id" v-for="(memrecmd, memindex) in sourcelist.leaders" v-if="memindex < 2">
                  <div class="right-mem-header">
                    <span :style="{backgroundImage:'url(' + memrecmd.cover_path + ')'}"></span>
                  </div>
                  <div class="right-mem-info">
                    <!-- <span class="iff-cat">IFF Chairman</span> -->
                    <span class="iff-name">{{memrecmd.title}}</span>
                    <!-- <span class="iff-name-en">Kevin Michael Rudd</span> -->
                    <span class="iff-mem-identity">{{memrecmd.source_name}}</span>
                    <span class="iff-mem-identity2">{{memrecmd.member_title}}</span>
                    <span class="iff-mem-identity1">{{memrecmd.note}}</span>
                  </div>
                  <div class="clear"></div>
                </div>
              </div>
              <div class="clear"></div>
            </div>
          </div>
          <div class="iff-agenda big-block"><!--成员模块-->
            <div class="iff-agenda-list iff-memberlist" v-if="listnormal.length > 1">
              <div class="sria-content-list" v-if="listnormal[0].list.length > 0">
                <div class="middle-left-block middle-main" >
                  <div class="side-header hy-light-at homered" @click="moreBtn" :data-id="listnormal[0].second_level_cid">
                    <span class="sidle-text">
                      <!-- <span class="focus-icon">
                      </span> -->
                      {{listnormal[0].second_level_name}}</span>
                    <span class="sidle-right-icon">
                      <img src="../../img/mobile/righticon.png">
                    </span>                  </div>
                  <div class="agendalist" @click="linkDetail" :data-id="listnormal[0].list[0].id">
                    <div class="agenda-img" :style="{backgroundImage:'url(' + prefix + listnormal[0].list[0].cover_path + ')'}"></div>
                    <div class="sria-article-info"
                         style="/* autoprefixer: off*/
                                -webkit-box-orient: vertical;
                                /* autoprefixer: on*/">
                      {{listnormal[0].list[0].note}}
                    </div>
                    <div class="article-share-icon">
                      <img src="../../img/mobile/at-share-icon.png">
                    </div>
                  </div>
                </div>
              </div>
              <div class="sria-content-list sria-member" v-if="listmember.length > 0">
                <div class="middle-mid-block middle-main" ><!--中间-->
                  <div class="side-header hy-light-md homered" @click="toMemberList" :data-cid="listmember[0].members[0].list[0].second_level_cid" :data-id="listmember[0].members[0].source_id">
                    <span class="sidle-text">{{listmember[0].members[0].source_name}}</span>
                    <span class="sidle-right-icon">
                      <img src="../../img/mobile/righticon.png">
                    </span>
                  </div>
                  <div class="about-sria">
                    <div class="member-iff-list">
                      <div class="iff-member-list iff-sria" @click="toMemberdetail" :data-cid="member.second_level_cid" :data-lstid="listmember[0].members[0].source_id" :data-id="member.id" v-for="(member, mindex) in listmember[0].members[0].list" v-if="mindex < 6">
                        <span class="iff-member-header" :style="{backgroundImage:'url(' + member.cover_path + ')'}"></span>
                        <div class="right-mem-info iffmem">
                          <span class="iffname">{{member.title}}</span>
                          <!-- <span class="iffname-en">Kevin Michael Rudd</span> -->
                          <span class="iff-identity">{{member.member_title}}</span>
                          <span class="iff-identity2">{{member.member_position1}}</span>
                          <span class="iff-identity1">{{member.member_position2}}</span>
                        </div>
                        <div class="clear"></div>
                      </div>
                      <div class="clear"></div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="sria-content-list" v-if="listnormal[1].list.length > 0 ">
                <div class="middle-left-block middle-main" >
                  <div class="side-header hy-light-at homered" @click="moreBtn" :data-id="listnormal[1].second_level_cid">
                    <span class="sidle-text">
                      <!-- <span class="focus-icon">
                      </span> -->
                      {{listnormal[1].second_level_name}}</span>
                    <span class="sidle-right-icon">
                      <img src="../../img/mobile/righticon.png">
                    </span>
                  </div>
                  <div class="agendalist" @click="linkDetail" :data-id="listnormal[1].list[0].id">
                    <div class="agenda-img" :style="{backgroundImage:'url(' + prefix + listnormal[1].list[0].cover_path + ')'}"></div>
                    <div class="sria-article-info"
                         style="/* autoprefixer: off*/
                                -webkit-box-orient: vertical;
                                /* autoprefixer: on*/">
                      {{listnormal[1].list[0].note}}
                    </div>
                    <div class="article-share-icon">
                      <img src="../../img/mobile/at-share-icon.png">
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="iff-agenda big-block" style="display: none;">
            <div class="iff-agenda-block" v-if="datalist.type === 'normal' && datalist.list.length > 0" v-for="(datalist,index) in dataList">
              <div class="side-header hy-light iff homered" @click="moreBtn" :data-id="datalist.second_level_cid">
                <span class="sidle-text">{{datalist.second_level_name}}</span>
                <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
              </div>
              <div class="agenda-block-list" @click="linkDetail" :data-id="datacont.id" v-for="(datacont,dataindex) in datalist.list" v-if="dataindex === 0" >
                <div class="agenda-block-img" :style="{backgroundImage:'url(' + prefix + datacont.cover_path + ')'}"></div>
                <div class="agenda-block-info">
                  <div class="agenda-title hy">
                    {{datacont.title}}
                  </div>
                  <div class="agenda-article-info"
                       style="
                          text-overflow: ellipsis;
                          display: -webkit-box;
                          -webkit-line-clamp: 3;
                          overflow: hidden;
                          /* autoprefixer: off*/
                          -webkit-box-orient: vertical;
                          /* autoprefixer: on*/">
                    {{datacont.note}}
                  </div>
                  <div class="article-share-icon iff">
                    <img src="../../img/mobile/at-share-icon.png">
                  </div>
                </div>
                <div class="clear"></div>
              </div>
            </div>
          </div>
        </div>
        <div class="clear"></div>
      </div>
      <div class="no-content" v-else>
        <div class="nosearch">
          <img src="../../img/mobile/emptycontent.jpeg" alt="">
        </div>
        <!-- 空空如也！ -->
      </div>
    </div>
    <div class="pc-bk" :data-id="dataList.length" v-if="thistab === 'lm'"><!--联盟-->
      <div class="container-list" v-if="dataList.length>0">
        <div class="content-list-body sria-list-body pc-bk">
          <div><!--头部banner-->
            <div class="content-first top-banner">
              <div class="link-detail">
                <div class="top-big-img" v-if="banner_list.length > 0">
                  <swiper :options="swiperOptionHome" ref="mySwiper">
                    <swiper-slide v-for="(contlist,index) in banner_list" :style="{backgroundImage:'url(' + contlist.img + ')'}"><div class="swiper-block" @click="bannerLink" :data-link="contlist.link"  style="width: 100%; height: 100%;"><span class="line-bot"></span></div></swiper-slide>
                    <div class="swiper-pagination" v-bind:class="{'hidden': paginationhd}" slot="pagination"></div>
                  </swiper>
                </div>
              </div>
            </div>
          </div>
          <div class="middle-block"><!--中间三模块-->
            <div class="middle-left-block side-block middle-main"><!--左侧-->
              <div class="side-header hy homered">
                <span class="sidle-text">丝路国际联盟（SRIA）
                <!-- <i>BRAINPOWER</i> -->
                </span>
                <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
              </div>
              <div class="meeting-list">
                <ul>
                  <li v-for="datanew in sideNav" @click="moreBtn" v-if="datanew.item_id !== 0" :data-id="datanew.id" :data-type="datanew.content_type">
                    <span class="focus-icon">
                    </span>
                    <span class="focus-title-link">
                      {{datanew.name}}
                    </span>
                  </li>
                </ul>
              </div>
              <div class="focus-img hy" v-for="ads in ads"  @click="bannerLink" :data-link="ads.link" :style="{backgroundImage:'url(' + ads.img + ')'}"></div>
            </div>
            <div class="middle-mid-block middle-main"><!--中间-->
              <div class="side-header hy-light-md homered" @click="moreBtn" :data-id="rcmdcontent.second_level_cid" v-for="(rcmdcontent, index) in dataList" v-if="rcmdcontent.type === 'top'">
                <span class="sidle-text">{{rcmdcontent.second_level_name
}}</span>
                <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
              </div>
              <div class="about-sria" v-for="(rcmdcontent, index) in dataList" v-if="rcmdcontent.type === 'top'">
                <swiper :options="swiperOptioniff" ref="mySwiper">
                  <swiper-slide v-for="(contenttop, contindex) in rcmdcontent.list"><div class="mid-block-banner" @click="bannerLink" :data-link="contenttop.link"  :style="{backgroundImage:'url(' + contenttop.img + ')'}" style="width: 100%;"><span class="line-bot"></span></div></swiper-slide>
                  <div class="swiper-pagination" v-bind:class="{'hidden': rcmdcontent.list.length < 2}"  slot="pagination"></div>
                </swiper>
                <!-- <div v-for="(contenttop, contindex) in rcmdcontent.list" v-if="contindex === 0">
                  <div v-if="rcmdcontent.link_type === 'banner'">
                    <div class="mid-block-banner" @click="bannerLink" :data-link="contenttop.link" :style="{backgroundImage:'url(' + contenttop.img + ')'}"></div>
                  </div>
                  <div v-if="rcmdcontent.link_type === 'news'" @click="linkDetail" :data-id="contenttop.id" >
                    <div class="abour-sria-img" :style="{backgroundImage:'url(' + prefix + contenttop.cover_path + ')'}"></div>
                    <div class="about-sria-content">
                      <div class="about-sria-note">
                       {{contenttop.note}}
                      </div>
                    </div>
                  </div>
                </div> -->
              </div>
            </div>
            <div class="middle-right-block middle-main" v-if="linksdata.length > 0"><!--右侧-->
              <div class="side-header hy-light-at homered" :data-id="linkiffid">
                <!-- <span class="sidle-text">{{linktitle}}</span> -->
                <span class="sidle-text">特别关注</span>
                <span class="sidle-icon"><img src="../../img/mobile/side-header.jpg"></span>
              </div>
              <div class="operation-list-right"  @click="toDetail"  :data-link="linkicon.link" v-for="(linkicon, linkindex) in linksdata">
                <div class="left-opt-icon">
                <img src="../../img/mobile/icon-siralogo.png">
                  <!-- <img src="../../img/mobile/icon-rule1.png" v-if="linkicon.icon === 'icon-rule'">
                  <img src="../../img/mobile/icon-vip1.png" v-if="linkicon.icon === 'icon-vip'">
                  <img src="../../img/mobile/icon-bill1.png" v-if="linkicon.icon === 'icon-bill'">
                  <img src="../../img/mobile/icon-process1.png" v-if="linkicon.icon === 'icon-process'">
                  <img src="../../img/mobile/icon-table1.png" v-if="linkicon.icon === 'icon-table'">
                  <img src="../../img/mobile/icon-question1.png" v-if="linkicon.icon === 'icon-question'"> -->
                </div>
                <div class="opt-line"></div>
                <div class="right-opt-text">
                  <p class="opt-name">{{linkicon.name}}</p>
                </div>
                <div class="clear"></div>
              </div>
            </div>
            <div class="clear"></div>
          </div>
          <div class="iff-agenda big-block"><!--成员模块-->
            <div class="iff-agenda-list iff-memberlist">
              <div class="sria-content-list" v-if="listnormal[0].list.length > 0">
                <div class="middle-left-block middle-main" >
                  <div class="side-header hy-light-at homered" @click="moreBtn" :data-id="listnormal[0].second_level_cid">
                    <span class="sidle-text">
                      <!-- <span class="focus-icon">
                      </span> -->
                      {{listnormal[0].second_level_name}}</span>
                    <span class="sidle-right-icon">
                      <img src="../../img/mobile/righticon.png">
                    </span>                  </div>
                  <div class="agendalist" @click="linkDetail" :data-id="listnormal[0].list[0].id" >
                    <div class="agenda-img" :style="{backgroundImage:'url(' + prefix + listnormal[0].list[0].cover_path + ')'}"></div>
                    <div class="sria-article-info"
                         style="/* autoprefixer: off*/
                                -webkit-box-orient: vertical;
                                /* autoprefixer: on*/">
                      {{listnormal[0].list[0].note}}
                    </div>
                    <div class="article-share-icon">
                      <img src="../../img/mobile/at-share-icon.png">
                    </div>
                  </div>
                </div>
              </div>
              <div class="sria-content-list sria-member" v-if="listmember.length > 0">
                <div class="middle-mid-block middle-main" ><!--中间-->
                  <div class="side-header hy-light-md homered" @click="toMemberList" :data-cid="listmember[0].members[0].list[0].second_level_cid" :data-id="listmember[0].members[0].source_id">
                    <span class="sidle-text">{{listmember[0].members[0].source_name}}</span>
                    <span class="sidle-right-icon">
                      <img src="../../img/mobile/righticon.png">
                    </span>
                  </div>
                  <div class="about-sria">
                    <div class="member-iff-list">
                      <div class="iff-member-list iff-sria"  @click="toMemberdetail" :data-cid="member.second_level_cid" :data-lstid="listmember[0].members[0].source_id" :data-id="member.id"  v-for="(member, mindex) in listmember[0].members[0].list" v-if="mindex < 6">
                        <span class="iff-member-header" :style="{backgroundImage:'url(' + member.cover_path + ')'}"></span>
                        <div class="right-mem-info iffmem">
                          <span class="iffname">{{member.title}}</span>
                          <!-- <span class="iffname-en">Kevin Michael Rudd</span> -->
                          <span class="iff-identity">{{member.member_title}}</span>
                          <span class="iff-identity2">{{member.member_position1}}</span>
                          <span class="iff-identity1">{{member.member_position2}}</span>
                        </div>
                        <div class="clear"></div>
                      </div>
                      <div class="clear"></div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="sria-content-list" v-if="listnormal[1].list.length > 0">
                <div class="middle-left-block middle-main" >
                  <div class="side-header hy-light-at homered" @click="moreBtn" :data-id="listnormal[1].second_level_cid">
                    <span class="sidle-text">
                      <!-- <span class="focus-icon">
                      </span> -->
                      {{listnormal[1].second_level_name}}</span>
                    <span class="sidle-right-icon">
                      <img src="../../img/mobile/righticon.png">
                    </span>
                  </div>
                  <div class="agendalist" @click="linkDetail" :data-id="listnormal[1].list[0].id">
                    <div class="agenda-img" :style="{backgroundImage:'url(' + prefix + listnormal[1].list[0].cover_path + ')'}"></div>
                    <div class="sria-article-info"
                         style="/* autoprefixer: off*/
                                -webkit-box-orient: vertical;
                                /* autoprefixer: on*/">
                      {{listnormal[1].list[0].note}}
                    </div>
                    <div class="article-share-icon">
                      <img src="../../img/mobile/at-share-icon.png">
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="clear"></div>
      </div>
      <div class="no-content" v-else>
        <div class="nosearch">
          <img src="../../img/mobile/emptycontent.jpeg" alt="">
        </div>
        <!-- 空空如也！ -->
      </div>
    </div>
    <div class="content-list-block mobile-top" v-for="(datalist, index) in dataList" v-if="datalist.type === 'normal' && datalist.list.length > 0"><!--手机端样式mobile-->
      <div class="content-first">
        <div class="top-center mobile-top">
          <div class="title-top-block">
            <div class="title-top">
              {{datalist.second_level_name}}
            </div>
            <div class="learn-all" @click="moreBtn" :data-id="datalist.second_level_cid" data-type="">
              查看全部
              <img src="../../img/mobile/right.png" alt="">
            </div>
            <div class="clear"></div>
          </div>
        </div>
        <div class="link-detail" @click="linkDetail" :data-id="datalist.list[0].id">
          <div class="top-big-img video" v-if="datalist.list[0].type === 1" :style="{backgroundImage:'url(' + prefix + datalist.list[0].cover_path + ')'}">
            <div class="big-video">
              <!--<video-player  class="video-player vjs-custom-skin"-->
              <!--ref="videoPlayer"-->
              <!--:playsinline="true"-->
              <!--:options="playerOptions"-->
              <!--@ready="playerReadied($event)"-->
              <!--&gt;-->
              <!--</video-player>-->
              <div class="video-img">
              <span class="video-icon">
                <img src="../../img/mobile/video-icon.png">
              </span>
              </div>
              <div class="top-time">
                {{datalist.list[0].publish_time}}
              </div>
              <div class="video-tt">
                {{datalist.list[0].title}}
              </div>
            </div>
          </div>
          <div class="top-big-img" v-else v-lazy="item"  :style="{backgroundImage:'url(' + prefix + datalist.list[0].cover_path + ')'}">
            <div class="shade-img-top"></div>
          </div>
          <div class="title-img-ft pc-top">
            <div class="top-pc-title">
              {{datalist.list[0].title}}
            </div>
            <div class="top-pc-info">
              {{datalist.list[0].note}}
            </div>
          </div>
        </div>
        <div class="first-mb-title" v-if="datalist.list.length > 0">
          <div class="top-content-intro">
            {{datalist.list[0].title}}
          </div>
          <div class="content-info">
            {{datalist.list[0].author}} {{datalist.list[0].publish_time}}
          </div>
        </div>
      </div>
      <div class="content-list-body mobile">
        <div class="content-list" v-for="(contlist,index) in datalist.list"  v-if="index!=0 && datalist.list.length > 0">
          <div  @click="linkDetail" :data-id="contlist.id" class="content-list-ele">
            <div class="pc-right-line" v-if="contlist.type === 1">
              <div class="left-img"  v-lazy:background-image="{src: prefix + contlist.cover_path, error: imgUrl, loading: imgUrl}">
                <div class="video-icon-lt">
                  <img src="../../img/mobile/video-icon.png">
                </div>
              </div>
            </div>
            <div class="pc-right-line" v-else>
              <div class="left-img"  v-lazy:background-image="{src: prefix + contlist.cover_path, error: imgUrl, loading: imgUrl}"></div>
            </div>
            <div class="right-text two-info">
              <div class="right-content-text">
                {{contlist.title}}
              </div>
              <div class="right-content-note pc-bk">
                {{contlist.note}}
              </div>
              <div class="content-info list-info mobile-top">
                {{contlist.author}} {{contlist.publish_time}}
              </div>
            </div>
            <div class="clear"></div>
          </div>
        </div>
        <div class="clear"></div>
      </div>
      <div class="top-center pc-top" v-if="thistab !== 'hy'">
        <div class="title-top-block">
          <div class="title-top">
            {{datalist.second_level_name}}
          </div>
          <div class="learn-all" @click="moreBtn" :data-id="datalist.second_level_cid">
            查看全部
            <img src="../../img/mobile/right.png" alt="">
          </div>
        </div>
      </div>
    </div>
    <footernav></footernav>
    <div class="to-top pc-top" @click="ToTop" v-if="totop">
      <img src="../../img/mobile/totop.png">
    </div>
  </div>
</template>
<script>
  import Vue from 'vue'
  import { swiper, swiperSlide } from 'vue-awesome-swiper'
  import { videoPlayer } from 'vue-video-player'
  import 'swiper/dist/css/swiper.css'
  import api from '../../utils/api'
  import videojs from 'video.js'
  import apiConfig from '../../utils/apiconfig.js'
  import helper from '../../utils/helper'
  import searchtab from './components/searchtab'
  import searchlist from './components/search'
  import footernav from './components/footernav'
  import loginpop from './components/login'
  import { Indicator, Lazyload, MessageBox } from 'mint-ui'
  Vue.use(Lazyload)
  export default {
    data () {
      return {
        registertp: false,
        userpages: [
          {
            name: '个人设置',
            id: 1
          },
          {
            name: '收藏文章',
            id: 2
          }
        ],
        showuserinfo: false,
        nickname: '',
        showlogin: false,
        sideNav: [],
        playerOptionsSx: {
          autoplay: false,
          muted: false,
          loop: false,
          preload: 'auto',
          language: 'zh-CN',
          aspectRatio: '16:9',
          fluid: true,
          sources: [{
            type: 'video/mp4',
            src: ''
          }],
          poster: '',
          width: document.documentElement.clientWidth,
          notSupportedMessage: '此视频暂无法播放，请稍后再试'
        },
        playerOptionsHome: {
          autoplay: false,
          muted: false,
          loop: false,
          preload: 'auto',
          language: 'zh-CN',
          aspectRatio: '24:14',
          fluid: true,
          sources: [{
            type: 'video/mp4',
            src: ''
          }],
          poster: '',
          width: document.documentElement.clientWidth,
          notSupportedMessage: '此视频暂无法播放，请稍后再试'
        },
        dataList: [],
        testimg: 'http://forum.api.qiezilife.com/upload/backend/news/cover/1526180752.jpeg',
        ishover: false,
        thistab: 'other',
        prefix: '',
        imgUrl: '',
        showsearchlist: false,
        showsearch: false,
        tablistprop: [],
        tablist: [],
        swiperOption: {
          autoplay: {
            delay: 5000,
            stopOnLastSlide: false,
            disableOnInteraction: true
          },
          slideToClickedSlide: true,
          slidesPerView: 5,
          spaceBetween: 10,
          pagination: {
            el: '.swiper-pagination',
            clickable: true
          },
          loop: false,
          initialSlide: 0
        },
        paginationhd: false,
        swiperOptionHome: {
          slideToClickedSlide: true,
          slidesPerView: 1,
          spaceBetween: 10,
          autoplay: {
            delay: 5000,
            stopOnLastSlide: false,
            disableOnInteraction: true
          },
          pagination: {
            el: '.swiper-pagination',
            type: 'bullets',
            clickable: true
          },
          navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev'
          },
          loop: false,
          initialSlide: 0
        },
        swiperOptioniff: {
          slideToClickedSlide: true,
          slidesPerView: 1,
          spaceBetween: 10,
          autoplay: {
            delay: 5000,
            stopOnLastSlide: false,
            disableOnInteraction: true
          },
          pagination: {
            el: '.swiper-pagination',
            type: 'bullets',
            clickable: true
          },
          navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev'
          },
          loop: false,
          initialSlide: 0
        },
        checktab: 0,
        videoSrc: 'http://babylife.qiniudn.com/FtRVyPQHHocjVYjeJSrcwDkApTLQ',
        videoImg: 'http://static.fdc.com.cn/avatar/usercenter/5996999fa093c04d4b4dbaf1_162.jpg',
        playStatus: '',
        muteStatus: '',
        isMute: true,
        isPlay: false,
        inittab: '',
        totop: false,
        hovertitle: '',
        navrecommend: [],
        linksdata: [],
        checkhome: '',
        members: [],
        searchtext: '',
        special_subject_list: '',
        activity_banner_list: '',
        special_column: [],
        video_list: '',
        special_attention: '',
        vediotab: 0,
        banner_list: [],
        listnormal: [],
        listmember: [],
        linkiffid: '',
        linktitle: '',
        searchshow: false,
        pagetitle: '国际金融论坛',
        captchakey: '',
        verifycodeurl: '',
        logining: false,
      }
    },
    components: {
      swiper,
      swiperSlide,
      videoPlayer,
      searchtab,
      searchlist,
      footernav,
      loginpop
    },
    created () {
      var nickname = localStorage.nickname
      console.log('lgin')
      if (nickname) {
        this.logining = true
      }
      this.nickname = nickname
      console.log(this.getStatus(this.$route.path))
      var mydata = sessionStorage.checktab
      this.verifycodeurl = localStorage.codeurl
      console.log(this.verifycodeurl)
      console.log(mydata)
      if (mydata) {
        this.getTablist(mydata)
      } else {
        this.getTablist('5')
      }
      var imgUrl = require('../../img/mobile/blank.jpg')
      this.imgUrl = imgUrl
      switch (mydata) {
        case 0:
          this.thistab = 'sx'
          break
        case 1:
          this.thistab = 'zk'
          break
        case 2:
          this.thistab = 'hy'
          break
        case 3:
          this.thistab = 'lm'
          break
        case 4:
          this.thistab = 'iff'
          break
        case 5:
          this.thistab = 'TOP'
          break
        default:
          this.thistab = 'other'
          break
      }
      this.loginsure()
    },
    mounted () {
      window.addEventListener('scroll', this.paperScroll)
    },
    watch: {
      '$route' (to, from) {
        console.log(this.getStatus(this.$route.path))
      }
    },
    methods: {
      signOut () {
        var param = {
          token: localStorage.token
        }
        MessageBox.confirm('确定执行此操作?').then(action => {
          api.GET(helper.getClientApiUrl(apiConfig.web.loginout), param, res => {
            this.logining = false
            localStorage.clear()
          }, res => {
            console.log(res)
          })
        });
      },
      toUserpage (ele) {
        var id = ele.currentTarget.dataset.id
        this.$router.push('/home/userpage?id=' + id)
      },
      showInfo () {
        this.showuserinfo = true
      },
      hideInfo () {
        this.showuserinfo = false
      },
      shownickname (name) {
        this.logining = true
        this.nickname = name
      },
      loginbloock (val) {
        this.showlogin = val
      },
      registerblock (val) {
        this.showlogin = val
      },
      checkVideo (ele) {
        var vdindex = ele.currentTarget.dataset.index
        var videourl = this.video_list[vdindex].list[0].video_url
        this.playerOptionsHome.sources[0].src = videourl
        this.playerOptionsHome.poster = this.video_list[vdindex].list[0].cover_path
        this.vediotab = parseInt(vdindex)
      },
      playerReadied (player) {
        const track = new videojs.AudioTrack({
          id: 'my-spanish-audio-track',
          kind: 'translation',
          label: 'Spanish',
          language: 'es'
        })
        player.audioTracks().addTrack(track)
        // Get the current player's AudioTrackList object.
        const audioTrackList = player.audioTracks()
        // Listen to the "change" event.
        audioTrackList.addEventListener('change', function () {
          // Log the currently enabled AudioTrack label.
          for (let i = 0; i < audioTrackList.length; i++) {
            const track = audioTrackList[i]
            if (track.enabled) {
              videojs.log(track.label)
              return
            }
          }
        })
      },
      bannerLink (ele) {
        window.location.href = ele.currentTarget.dataset.link
      },
      getStatus (urlStr) {
        var urlStrArr = urlStr.split('/')
        return urlStrArr[urlStrArr.length - 1]
      },
      tabHover (ele) {
        this.ishover = true
        this.hovertitle = ele.name
        this.navrecommend = ele.news
        console.log(this.navrecommend)
      },
      outHover () {
        this.ishover = false
      },
      paperScroll () {
        var thistop = document.documentElement.scrollTop || document.body.scrollTop
        if (thistop > 10) {
          this.totop = true
        } else {
          this.totop = false
        }
      },
      // ToTop () {
      //   var gotoTop = function () {
      //     var currentPosition = document.documentElement.scrollTop || document.body.scrollTop
      //     currentPosition -= 20
      //     if (currentPosition > 0) {
      //       window.scrollTo(0, currentPosition)
      //     } else {
      //       window.scrollTo(0, 0)
      //       clearInterval(timer)
      //       timer = null
      //     }
      //   }
      //   var timer = setInterval(gotoTop, 1)
      // },
      ToTop () {
        window.scrollTo(0, 0)
      },
      toEng () {
        sessionStorage.clear()
        window.location.href = 'http://en.iff.org.cn/'
      },
      GoToindex () {
        this.checktab = this.tablist.length - 1
        this.thistab = 'TOP'
        this.checkhome = 'TOP'
        this.getIndexlist()
        sessionStorage.setItem('checktab', this.checktab)
      },
      linkDetail (e) {
        if (e.currentTarget.dataset.fid) {
          let fid = parseInt(e.currentTarget.dataset.fid)
          sessionStorage.setItem('checktab', fid - 1)
        }
        if (e.currentTarget.dataset.len && e.currentTarget.dataset.fid > 0) {
          console.log(e.currentTarget.dataset.id)
          this.$router.push('/home/detail?id=' + e.currentTarget.dataset.id + '&type=author')
        } else {
          console.log(e.currentTarget.dataset.id)
          this.$router.push('/home/detail?id=' + e.currentTarget.dataset.id)
        }
      },
      linkTopicDetail (e) {
        this.$router.push('/home/conferencetopics?id=' + e.currentTarget.dataset.id)
      },
      authorDetail (e) {
        console.log(e.currentTarget.dataset.id)
        this.$router.push('/home/authordetail?id=' + e.currentTarget.dataset.id)
      },
      toDetail (e) {
        console.log(e.currentTarget.dataset.link)
        window.location.href = e.currentTarget.dataset.link
      },
      moreBtn (e) {
        if (e.currentTarget.dataset.fid) {
          let fid = parseInt(e.currentTarget.dataset.fid)
          sessionStorage.setItem('checktab', fid - 1)
        }
        console.log(e.currentTarget.dataset.type)
        let conttype = e.currentTarget.dataset.type
        if (conttype === 'AUTHOR') {
          this.$router.push('/home/authorlist?id=' + e.currentTarget.dataset.id)
        } else if (conttype === 'NEWS_DETAIL') {
          this.$router.push('/home/detail?id=' + e.currentTarget.dataset.itemid)
        } else {
          this.$router.push('/home/list?id=' + e.currentTarget.dataset.id)
        }
      },
      toMemberList (e) {
        console.log(e.currentTarget.dataset.id)
        console.log(e.currentTarget.dataset.cid)
        this.$router.push('/home/ifflist?id=' + e.currentTarget.dataset.id + '&cid=' + e.currentTarget.dataset.cid)
      },
      toMemberdetail (e) {
        console.log(e.currentTarget.dataset.id)
        console.log(e.currentTarget.dataset.cid)
        this.$router.push('/home/detail?id=' + e.currentTarget.dataset.id + '&cid=' + e.currentTarget.dataset.cid + '&listid=' + e.currentTarget.dataset.lstid + '&type=iff')
      },
      searchBtn () {
        this.showsearch = true
      },
      searchBtn1 () {
        this.showsearchlist = true
      },
      opensearch (val) {
        console.log('test:' + val)
        this.showsearch = val
      },
      openSearchTop () {
        var sp = document.getElementById('searchmain')
        var sp1 = document.getElementById('searchmain1')
        if (sp) {
          if (!sp.contains(event.target)) {
            this.searchshow = false
          } else {
            if (this.searchshow === false) {
              this.searchshow = true
            } else {
              this.searchshow = false
            }
          }
        }
        if (sp1) {
          if (!sp1.contains(event.target)) {
            this.searchshow = false
          } else {
            if (this.searchshow === false) {
              this.searchshow = true
            } else {
              this.searchshow = false
            }
          }
        }
      },
      searchlink (val) {
        console.log('testsss:' + val)
        this.showsearchlist = val
      },
      searchcan (val) {
        this.showsearchlist = val
        this.searchshow = false
      },
      goindex (ele) {
        console.log('haha:' + ele)
        this.checktab = ele
        this.getIndexlist()
      },
      getTablist (ele) {
        var tmp = Date.parse(new Date())
        tmp = tmp / 1000
        console.log(tmp)
        var param = {
          timestamp: tmp
        }
        this.params = param
        api.GET(helper.getClientApiUrl(apiConfig.web.getTab), this.params, res => {
          this.tablist = res
          this.tablistprop = res
          if (ele !== '5') {
            this.checktab = parseInt(ele)
            this.getDatalist(this.checktab + 1)
          } else {
            this.checktab = this.tablist.length - 1
            this.getIndexlist()
            this.checkhome = 'TOP'
          }
          this.loading = false
          switch (this.checktab) {
            case 0:
              this.thistab = 'sx'
              break
            case 1:
              this.thistab = 'zk'
              break
            case 2:
              this.thistab = 'hy'
              break
            case 3:
              this.thistab = 'lm'
              break
            case 4:
              this.thistab = 'iff'
              break
            case 5:
              this.thistab = 'TOP'
              break
            default:
              this.thistab = 'other'
              break
          }
        }, res => {
          console.log(res)
          Indicator.close()
        })
      },
      getIndexlist () {
        var that = this
        var param = {
          action: 'HOME'
        }
        Indicator.open('加载中...')
        api.GET(helper.getClientApiUrl(apiConfig.web.indexurl), param, res => {
          document.title = '国际金融论坛'
          that.prefix = api.DOMAIN() + helper.getImageApiPrefix()
          this.checkhome = 'TOP'
          that.special_attention = res.special_attention
          that.video_list = res.video_list
          that.special_column = res.special_column
          that.activity_banner_list = res.activity_banner_list
          that.special_subject_list = res.special_subject_list
          that.banner_list = res.banner_list
          console.log(that.banner_list)
          if (that.banner_list.length === 1) {
            this.paginationhd = true
          } else {
            this.paginationhd = false
          }
          var videourl = this.video_list[0].list[0].video_url
          this.playerOptionsHome.sources[0].src = videourl
          this.playerOptionsHome.poster = this.video_list[0].list[0].cover_path
          Indicator.close()
        }, res => {
          console.log(res)
        })
      },
      getDatalist (tab) {
        var that = this
        that.dataList = []
        var param = {
          fid: tab
        }
        Indicator.open('加载中...')
        this.params = param
        console.log(param)
        api.GET(helper.getClientApiUrl(apiConfig.web.getData), this.params, res => {
          console.log(tab)
          this.pagetitle = res.nav_title + '-国际金融论坛'
          document.title = this.pagetitle
          that.prefix = api.DOMAIN() + helper.getImageApiPrefix()
          this.checkhome = 'other'
          that.dataList = res.news
          var listmember = []
          var listnormal = []
          that.dataList.forEach((item, index) => {
            if (item.type === 'top' && item.list.length > 0) {
              if (item.list[0].type === 1) {
                var videourl = item.list[0].video_url
                this.playerOptionsSx.sources[0].src = videourl
                this.playerOptionsSx.poster = that.prefix + item.list[0].cover_path
              }
            }
            if (item.type === 'normal' && item.list.length > 0) {
              listnormal.push(item)
            } else if (item.type === 'member' && item.members.length > 0) {
              listmember.push(item)
            }
            if (item.link_type === 'link') {
              that.linksdata = item.list
              that.linktitle = item.second_level_name
              that.linkiffid = item.second_level_cid
            }
          })
          that.listmember = listmember
          that.listnormal = listnormal
          console.log(that.listmember)
          console.log(that.listnormal)
          that.sideNav = res.nav
          that.banner_list = res.banner_list
          console.log(that.banner_list)
          if (that.banner_list.length === 1) {
            this.paginationhd = true
          } else {
            this.paginationhd = false
          }
          that.ads = res.ads
          console.log(that.dataList)
          Indicator.close()
        }, res => {
          console.log(res)
        })
      },
      toIffDetail (val) {
        this.checktab = parseInt(val.currentTarget.dataset.id) - 1
        sessionStorage.setItem('checktab', this.checktab)
        var detailid = val.currentTarget.dataset.listid
        this.$router.push('/home/detail?id=' + detailid)
      },
      selectab (val) {
        if (val.currentTarget.dataset.id !== 'TOP') {
          this.checktab = parseInt(val.currentTarget.dataset.id) - 1
//          this.checkhome = 'TOP'
        } else {
          this.checktab = this.tablist.length - 1
          this.checkhome = 'other'
        }
        switch (this.checktab) {
          case 0:
            this.thistab = 'sx'
            break
          case 1:
            this.thistab = 'zk'
            break
          case 2:
            this.thistab = 'hy'
            break
          case 3:
            this.thistab = 'lm'
            break
          case 4:
            this.thistab = 'iff'
            break
          case 5:
            this.thistab = 'TOP'
            break
          default:
            this.thistab = 'other'
            break
        }
        sessionStorage.setItem('checktab', this.checktab)
        console.log('~~' + val.currentTarget.dataset.id)
        this.getDatalist(val.currentTarget.dataset.id)
      },
      registerBtn () {
        var that = this
        console.log('re')
        this.showlogin = true
        that.registertp = true
      },
      loginBtn () {
      // MessageBox('提示', '功能正在上线中……')
        this.showlogin = true
        this.registertp = false
      }
    },
    computed: {
      player () {
        return this.$refs.videoPlayer.player
      }
    }
  }
</script>
<style>
  .clear{
    clear: both;
  }
  .swiper-slide.active span{
    color: #A72037;
  }
  .swiper-slide.active .line-bot{
    color: #A72037;
    border-bottom: 2px solid #A72037;
    position: absolute;
    width: 70%;
    margin: 0 15%;
    height: 37px;
    left: 0;
  }
  .title-top{
    font-size: 23px;
    display: inline-block;
  }
  .content-list-body{
    border-top:1px solid #efefef;
  }
  .learn-all{
    color: #4e6e6d;
    display: inline-block;
    float: right;
    margin-top: 7px;
    line-height: 23px;
    font-size: 13px;
    cursor: pointer;
  }
  .learn-all img{
    width: 7px;
    vertical-align: middle;
    margin-left: 5px;
    margin-top: -4px;
  }
  .top-big-img{
    margin: 10px 0;
    position: relative;
  }
  .top-big-img.video img{
    width:100%;
    height:auto;
  }
  .top-big-img img{
    width:100%;
    height: 32vw;
  }
  .top-big-img{
    width:100%;
    height: 32vw;
    background-size: cover;
    background-position: center;
  }
  .top-content-intro{
    font-size: 16px;
    color: #2b2b2b;
    line-height: 1.6;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    /* autoprefixer: off*/
-webkit-box-orient: vertical;
/* autoprefixer: on*/
    overflow: hidden;
  }
  .video-icon-lt img{
    width: 35px;
    height:35px;
    margin-top: 22%;
  }
  .content-list{
    padding: 15px 0;
  }
  .content-list:last-child{
    border:none;
  }
  .footer-content{
    background: #222126;
    color: #ffffff;
    margin-top: 30px;
  }
  .footer-tab li.noline{
  border-right:none;
  }
  .swiper-container {
    width: 100%;
    height: 100%;
  }
  .swiper-slide {
    text-align: center;
    font-size: 16px;
    color: #636363;
    background: #fff;
  }
  .swiper-slide span.active{
    border-bottom: 2px solid #00b2ff;
  }
  .days-swpier .swiper-button-prev{
    position: absolute;
    left: -50px;
    top: 10px;
    background-size: 12px;
  }
  .days-swpier .swiper-button-next{
    position: absolute;
    right: -50px;
    top:10px;
    background-size: 12px;
  }
  .top-time{
    position: absolute;
    top: 10px;
    color: #fff;
    padding: 5px 10px 5px 25px;
    right: 0px;
    background-image: url(../../img/mobile/black.png);
  }
  .video-tt{
    position: absolute;
    bottom: 0;
    text-align: center;
    width: 100%;
    color: #fff;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    background: rgba(0, 0, 0, 0.26);

  }
  /*.vjs-custom-skin > .video-js .vjs-control-bar{*/
    /*display: none;*/
  /*}*//*
  #swiper-tab{
    display: block;
  }*/
  .footer-copyright img{
  width: 18px;
    vertical-align: middle;
    margin-right: 5px;
}
.video-icon{
  position:  absolute;
  top: 0;
  left: 0;
  width:  100%;
  height:  100%;
  background: rgba(0, 0, 0, 0.21);
  text-align:  center;
}
  .top-big-img .video-icon img{
  width: 17%;
  vertical-align:  middle;
  margin-top: 6%;
}
.video-icon-lt{
    position:  absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
}
.nosearch img{
  width: 500px;
}
.nosearch{
  margin: 40px 0 10px 0;
}
  @media screen and (min-width: 1200px) {
    #swiper-tab{
      display: none;
    }
    .title-top-block{
      border-bottom: 2px solid #000;
      height: 30px;
      padding-bottom: 20px;
      margin: 0 10px;
    }
    .iff-brief-intro .title-top-block{
      margin: 30px  0px;
    }
    .top-center{
      text-align: center;
    }
    .title-top,.learn-all{
      display: inline-block;
    }
    .title-top{
      float: left;
      font-size: 24px;
      font-weight: bold;
    }
    .content-list-body{
      border:0;
    }
    .learn-all{
      float: right;
      margin: 17px 0 0 0;
      font-size: 15px;
    }
    .learn-all img{
      width: 9px;
      margin-left: 11px;
    }
    .pc-top-level img{
      width: 32%;
      display: inline-block;
      float: left;
      margin-top: 20px;
    }
    .pc-top-level span{
      display: inline-block;
      width: 36%;
      text-align: center;
      float: left;
      font-size: 30px;
    }

  .left-img .video-icon-lt img{
    width: 60px;
    height: 60px;
    margin-top: 17%;

  }
    .first-mb-title{
      display: none;
    }
    .top-pc-title{
      font-size: 28px;
      font-weight: bold;
      margin-bottom: 10px;
    }
    .top-pc-info{
      font-size: 18px;
      color: #696969;
    }
    .top-big-img{
      position: relative;
      height: 480px;
    }
    .title-img-ft{
      /*position: absolute;
      padding: 0 30px;
      bottom: 15px;*/
      margin: 20px 0 10px;
    }
    .shade-img-top{
      position: absolute;
      width: 100%;
      height: 100%;
    }
    .top-big-img .video-icon img{
      width: 9%;
      margin-top: 12%;
    }
    .video-tt{
      height: 50px;
      line-height: 50px;
      font-size: 17px;
    }
    .video-icon-lt{
      width: 100%;
      height: 100%;
      text-align: center;
    }
    .container-list{
      margin-bottom: 50px;
    }
  }

</style>
